import { graphql } from 'gatsby';
import React from 'react';

export default function Article({ data }) {
  console.log('Article props.data :', data);
  return (
    <article>
      <h1>{data.markdownRemark.frontmatter.title}</h1>
      <p>日期：{data.markdownRemark.frontmatter.date}</p>
      <div dangerouslySetInnerHTML={{ __html: data.markdownRemark.html }}></div>
    </article>
  );
}

export const query = graphql`
  query ($slug: String) {
    markdownRemark(fields: { slug: { eq: $slug } }) {
      frontmatter {
        title
        date
      }
      html
    }
  }
`;
